import { ref} from 'vue'
import {ElMessage as message } from 'element-plus'

const pasteText = ref('')

export function useCopyText() {
  const text = ref('')
 
  return {
    /** 执行文本复制的函数*/
    copyText,
    /**复制的文本 */
    text: text,
  }
}



function copyText(text: string) {
  if (navigator.clipboard.writeText) {
    navigator.clipboard.writeText(text)
      .then(() => {
        message.success(`复制成功`)
      })
      .catch(() => {
        message.error('复制失败，请检查浏览器是否开启复制权限！')
      })
  } else copy(text)
}

// 兼容旧版本浏览器
function copy(val: string) {
  const input = document.createElement("input");
  input.setAttribute("value", val);
  input.style.display = 'none'
  document.body.appendChild(input);
  input.select();
  document.execCommand("copy");
  document.body.removeChild(input);
  message.success(`复制成功`)
}

// 读取剪切板有些浏览器不支持，这个涉及用户隐私。复制粘贴也没必要读取剪切板，能实现复制功能即可，因为复制的值是我们给的，这个剪切板的值我们是知道的。
function readClipboardText() {
  if (navigator.clipboard && navigator.clipboard.readText)
    navigator.clipboard.readText()
      .then((text) => {
        message.success('粘贴成功')
        pasteText.value = text
      })
      .catch(() => {
        message.error('粘贴失败，请检查该浏览器是否允许网页读取剪切板！')
      })
  else { console.log("该浏览器不支持navigator.clipboard.readText api") }
}